import { PropType, defineComponent } from 'vue';
import useModule from './index.module';
import styles from './index.module.scss';
import { VideoConfig, VideoDefinition } from '@/types/JSX';

export default defineComponent({
  name: 'LindadayoVideoPlayer',
  props: {
    config: {
      type: Object as PropType<VideoConfig>,
      default: () => {
        return {
          width: '100%',
          height: '100%',
          volume: 0.6,
          loop: false,
          poster: '',
          marginControls: false,
          download: false,
          seekedStatus: 'play',
          defaultLevel: ''
        }
      }
    },
    definitionList: {
      type: Array as PropType<VideoDefinition[]>,
      required: true,
      default: () => {
        return []
      }
    }
  },
  setup(props, { emit }) {
    useModule(props, emit);
    return () => (
      <div id='linpengVideoPlayer' class={styles.linpengVideoPlayer}>
        <div id='root'></div>
      </div>
    )
  }
})
